import React, {useEffect, useState} from 'react';
import {useRoutes} from "react-router-dom";
import router from "@/routes";
import {ConfigProvider, theme} from "antd";

function App() {
    const themeMedia = window.matchMedia("(prefers-color-scheme: light)");
    const [_theme, setTheme] = useState(themeMedia.matches ? 'light' : 'dark');

    useEffect(() => {
        themeMedia.addListener(e => {
            if (e.matches) {
                setTheme('light');
            } else {
                setTheme('dark');
            }
        })
    }, []);

    return (
        <ConfigProvider
            theme={{
                algorithm: _theme === 'light' ? theme.defaultAlgorithm : theme.darkAlgorithm
            }}>
            {useRoutes(router)}
        </ConfigProvider>
    );
}

export default App;